<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .box{display:none;}
    </style>
</head>
<body>
<div id="div2">
    <input class="active" type="button" value="1">
    <input type="button" value="2">
    <input type="button" value="3">
</div>
<div class="box" style="display:block;">11</div>
<div class="box">22</div>
<div class="box">33</div>
</body>
<script type="text/javascript">
	
	//面向对象构造函数
    window.onload = function () {
        var oTab = new TabSwitch("div2");
    }
    var aBtn = null;
    var aDiv = null;
    function TabSwitch(id){
        var div2 = document.getElementById(id);
        this.aBtn = div2.getElementsByTagName('input');
        this.aDiv = document.getElementsByClassName('box');
        var _this =this;
        for(i=0;i<this.aBtn.length;i++){
            this.aBtn[i].index = i;
            this.aBtn[i].onclick = function () {
                _this.tab(this);
            }
        }
    }
    TabSwitch.prototype.tab = function (aBtn){
        for(i=0;i<this.aBtn.length;i++){
            this.aBtn[i].className = '';
            this.aDiv[i].style.display = 'none';
        }
        aBtn.className = 'active';
        this.aDiv[aBtn.index].style.display = 'block';
    }
    
    //	构造函数
						function Pro(name, age, sex, obj, speak, love) {
							this.name = name;
							this.age = age;
							this.sex = sex;
							this.obj = obj;
							this.speak = speak;
							this.love = love;
						}
			
						var person = new Pro("小明", 18, "男", "有男朋友", "会说话", "会谈恋爱");
						document.write(person.name + person.age + person.sex + person.obj + person.speak + person.love+"<br />");


	//		工厂模式    创建一个汽车对象
						function createCar() {	
							var car = new Object();
							car.brend = '兰博基尼';
							car.hege = '合格';
							car.price = '$998';
							car.shuom = '你想拥有一辆无比炫酷的车吗，只要998，赶紧订购吧';
							return car;
						}
						var car1 = createCar();
						document.write(car1.brend+car1.hege+car1.price+car1.shuom);
	
</script>
</html>
